<%-- 
    Document   : new_obs
    Created on : May 3, 2013, 4:03:46 PM
    Author     : fikri
--%>
<%@ include file="/WEB-INF/jsp/include/page_header.jspf" %>
<%@ taglib prefix="display" uri="http://displaytag.sf.net"%>
<%@page contentType="text/html" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">       
        <script type="text/javascript">
            $(document).ready(function() {
                $('.uppercase').each(function() {
                    $(this).blur(function() {
                        $(this).val($(this).val().toUpperCase());
                    });
                });   
            });
            
            function getSeverityDay(id) {
                var url = '${pageContext.request.contextPath}/observation?getSeverityDays&id=' + id;
                $.get(url,
                        function(data) {
                            $('#severity_day_count').val(data);
                        }, "html");
            }
            
            function RemoveNonNumeric( strString )
            {
                  var strValidCharacters = "1234567890";
                  var strReturn = "";
                  var strBuffer = "";
                  var intIndex = 0;
                  // Loop through the string
                  for( intIndex = 0; intIndex < strString.length; intIndex++ )
                  {
                        strBuffer = strString.substr( intIndex, 1 );
                        // Is this a number
                        if( strValidCharacters.indexOf( strBuffer ) > -1 )
                        {
                              strReturn += strBuffer;
                        }
                  }
                  return strReturn;
            }
            
            function checkNumeric(elmnt,inputTxt){
                elmnt.value = RemoveNonNumeric(inputTxt);
                return;
            }
           
        </script>
        <style>
            div#dialog-form p{
                margin: 0px; padding: 0 0 10px 0; 
            }
            div#dialog-form label {
                width: 10em;
                float: left;
                text-align: right;
                margin-right: 10px;
                display: block;
                color: #000;
                font-family:Tahoma;
                font-size: 19px;
                margin-left: -0.5px;
            }
            div#dialog-form font, textArea {
                font-size: 13px;
            }
            div#dialog-form select { font-size: 13px; font-family: 'Averia Libre', cursive; }
            div#dialog-form input {  font-size: 13px;}
            div#dialog-form input.text, input.textarea { margin-bottom:12px; width:95%; padding: .1em; }            
            .ui-dialog .ui-state-error { padding: .3em; }
            .validateTips { border: 1px solid transparent; padding: 0.3em; color: red; font-weight: bold}
        </style>
    </head>
    <body>
        <div id="fileQueue"></div>
        <div id="dialog-form" title="Tasks">
            <p class="validateTips"><em>All form fields are required.</em></p>
            <br/>
            <s:useActionBean beanclass="exatrez.stripes.util.ListUtil" var="list"/>
            <s:form beanclass="exatrez.stripes.action.ObservationAction" name="popupForm">                
                <s:hidden name="observationTask.observationTaskId" id="_id"/>      
                <s:hidden name="observation.observationId" id="parent"/>
                <p>
                    <label>OBS ID:</label>${actionBean.obsID}<s:text name="observationTask.seq" id="_seq" maxlength="3" size="5" onblur="return checkNumeric(this, this.value);"/>                    
                </p>
                <p>
                    <label>Title:</label>
                    <s:text name="observationTask.title" id="_title" class="uppercase" size="50"/>
                </p>
                <p>
                    <label>Detail:</label>
                    <s:textarea name="observationTask.detail" id="_detail" rows="8" cols="50"/>
                </p>
                <p>
                    <label>Info:</label>
                    <s:textarea name="observationTask.info" id="_info" rows="8" cols="50"/>
                </p>
                <p>
                    <label>Severity:</label>
                    <s:select name="observationTask.severity.severityCodeId" 
                              style="width:150px" id="_severity" onchange="getSeverityDay(this.value);">
                        <s:option value="">Please Choose</s:option>
                        <s:options-collection collection="${list.severityList}" label="severityName" value="severityCodeId"/>
                    </s:select>                            
                </p>  
                <p>
                    <label>Severity Days:</label>
                    <s:text name="observationTask.severityDayCount" id="severity_day_count"/>                          
                </p>
                
                
        </s:form>
    </div>
</body>
</html>
